<template>
  <van-button 
  :icon="likeOr===1 ? 'good-job' : 'good-job-o'"
  :class="{color: likeOr === 1}"
  type="default" 
  :loading="loadingStatus"
  @click="setLike"
  />
</template>

<script>
import {onDelLikeAurAPI,onLikeArticleAPI} from '@/api'
export default {
name: 'Like',
model: {
  prop: 'likeOr',
  event: 'updateAttitude'
},
props: {
  likeOr:{
    type: Number,
    required: true
  },
  art_id:{
    type: [String,Number,Object],
    required: true
  }
},
data(){
  return {
    loadingStatus: false
  }
},
methods: {
  async setLike(){
    this.loadingStatus = true
    try {
      let status = -1
      if(this.likeOr === 1) {
        //取消点赞
        await onDelLikeAurAPI(this.art_id)
      }
      else {
        await onLikeArticleAPI(this.art_id)
        status = 1
      }
      //改变视图
      this.$emit('updateAttitude',status)
      this.$toast.success(status === 1 ? '点赞成功' : '取消点赞成功')
    } catch (error) {
      this.$toast('操作失败，请稍后重试')
    }
    this.loadingStatus = false
  }
}
}
</script>

<style scoped lang="less">
.color{
  color: #e74033 !important;
}
</style>